<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>微仓领用记录</title>
  <link rel="stylesheet" href="/layui/layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="/layui/layuiadmin/style/admin.css" media="all">
  <link rel="stylesheet" href="/js/css/clearcss.css" media="all">
  <style>
    .layui-card-header{
      height: 68px;
      line-height: 58px;
    }
    .layui-inline .layui-form-label2{
      padding-left: 20px;
      padding-top: 10px;
      padding-bottom: 10px;
      width: 80px;
      font-weight: 400;
      line-height: 20px;
      text-align: right;
    }

  </style>
</head>
<body>
<div class="layui-fluid">
  <div class="layui-row layui-col-space15">
    <div class="layui-col-md12">
      <div class="layui-card">
        <div class="layui-card-header layui-form">
          <div class="layui-inline">
            <label class="layui-form-label2" style="width:auto">名称：</label>
            <div class="layui-input-inline">
              <input type="text" name="partDes" id="partDes" placeholder="请输入商品名称" autocomplete="off" class="layui-input">
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label2">库位：</label>
            <div class="layui-input-inline">
              <input type="text" name="location" id="location" class="layui-input"  style="width: 199px" placeholder="请输入库位"/>
            </div>
          </div>
          <div class="layui-inline">
            <label class="layui-form-label2" style="width:auto">领用人：</label>
            <div class="layui-input-inline">
              <input type="text" name="userName" id="userName" placeholder="请输入用户名" autocomplete="off" class="layui-input">
            </div>
          </div>
          <div class="layui-inline" style="float: right;">
            <button class="layui-btn layui-btn-primary layui-btn-sm" lay-active="reload">清空</button>
            <button class="layui-btn layui-btn-sm" lay-event="AllData" data-type="AllData" lay-active="AllData">搜索</button>
          </div>
        </div>
        <div class="layui-card-body">
          <table id="toolReceiveLogList" lay-filter="toolReceiveLogList" lay-data="{id:'toolReceiveLogList'}"></table>
        </div>

        <div type="text/html" id="role_list" style="display:none">
          <a class="layui-btn layui-btn-sm" lay-event="outExcel">导出记录</a>
        </div>

      </div>
    </div>
  </div>
</div>

<script src="/layui/layuiadmin/layui/layui.js"></script>
<!--<script type="text/javascript" src="/js/jquery-1.8.0.js"></script>-->
<script type="text/javascript" src="/js/jquery-3.7.1.min.js"></script>

<script>
  addId=0;
  layui.use(['table','layer','util','form'], function(){
    let table = layui.table;
    let layer=layui.layer;
    let util=layui.util;
    let form=layui.form;
    table.render({
      elem: '#toolReceiveLogList'
      ,url: '/intelligence/getToolReceiveLogList' //数据接口
      ,page: true //开启分页
      ,limit:15
      ,limits:[15,20,50,100,2000]
      ,toolbar:'#role_list'
      ,loading:true
      ,height: 'full-168'
      ,cols: [
        [ //表头
          {field:'No', width:60, title: '序号', type:'numbers', fixed: 'left'}
          ,{field: 'id', title: 'ID',  hide:'hide'}
          ,{field: 'deviceId', title: '设备id'}
          ,{field: 'username', title: '领用人'}
          ,{field: 'partDes', title: '商品名称',  sort: true}
          ,{field: 'quantity', title: '数量'}
          ,{field: 'location', title: '库位', width:135}
          ,{field: 'createdAt', title: '领用时间', sort: true}
        ]
      ]
    });
    table.on('toolbar(toolReceiveLogList)', function(obj){
      var checkStatus = table.checkStatus(obj.config.id);
      switch(obj.event){
        case "outExcel":
          let partDes=$("#partDes").val();
          let location=$("#location").val();
          let userName=$("#userName").val();
          window.open("/intelligence/outGravityCabinetToolExcel?partDes="+partDes+"&location="+location+"&userName="+userName,"_blank");
          break;
      };
    });
    util.event('lay-active', {
      reload:function(res){
        location.reload();
      },
      AllData:function(){
        let partDes=$("#partDes").val();
        let location=$("#location").val();
        let userName=$("#userName").val();
        if(partDes==''  && location=='' && userName==''){
          layer.msg("当前无筛选条件")
        }else{
          table.reload('toolReceiveLogList', {
            url: '/intelligence/SearchToolReceiveLogList'
            ,where: {
              partDes:partDes,
              location:location,
              userName:userName,
            } //设定异步数据接口的额外参数
          });
        }

      },
    })

  })
</script>
</body>
</html>
